<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="custom" tagdir="/WEB-INF/tags" %>
<html>
<head>
    <title>案件留言</title>
    <c:if test="${not empty param.mini}">
        <c:set var="contextPath" value="${pageContext.request.contextPath}" scope="page"/>
        <link href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
        <link href="${contextPath}/resources/css/style.default.css" rel="stylesheet">
        <script src="${contextPath}/resources/js/jquery-1.11.1.min.js"></script>
        <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!--[if lt IE 9]>
        <script src="${contextPath}/resources/js/html5shiv.js"></script>
        <script src="${contextPath}/resources/js/respond.min.js"></script>
        <![endif]-->
        <script src="${contextPath}/resources/js/jquery-migrate-1.2.1.min.js"></script>
        <script src="${contextPath}/resources/js/jquery-ui-1.10.3.min.js"></script>
        <script src="${contextPath}/resources/js/bootstrap.min.js"></script>
        <script src="${contextPath}/resources/js/modernizr.min.js"></script>
        <script src="${contextPath}/resources/js/jquery.sparkline.min.js"></script>
        <script src="${contextPath}/resources/js/toggles.min.js"></script>
        <script src="${contextPath}/resources/js/retina.min.js"></script>
        <script src="${contextPath}/resources/js/jquery.cookies.js"></script>

        <script src="${contextPath}/resources/js/morris.min.js"></script>
        <script src="${contextPath}/resources/js/raphael-2.1.0.min.js"></script>

        <script src="${contextPath}/resources/js/custom.js"></script>
        <script src="${contextPath}/resources/js/jquery.gritter.min.js"></script>
        <style type="text/css">
            html {
                overflow-x: hidden;
            }
        </style>
    </c:if>
</head>
<body style="background:none;">
<c:if test="${empty param.mini}">
    <div class="pageheader">
        <a href="javascript:window.history.go(-1);" class="btn btn-default pull-right">返回</a>

        <h2>留言列表</h2>
    </div>
</c:if>
<div class="contentpanel">
    <form class="form-inline">
        <div class="btn-group mr10">
            <a href="add_comments" class="btn btn-primary" type="button" data-toggle="modal"
               data-target="#myModal">
                <i class="fa fa-mail-reply"></i> 留言
            </a>
        </div>
    </form>

    <ul class="media-list comment-list">
        <c:forEach items="${listDto.list}" var="item">
            <li class="media well" style="${empty param.mini?"background-color: #FDFDFD;":""}">
                <custom:comments_item item="${item}"/>
            </li>
        </c:forEach>
    </ul>

    <!-- 模态框（Modal） -->
    <form id="form">
        <input type="hidden" name="caseUuid" value="${listDto.caseUuid}">

        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close"
                                data-dismiss="modal" aria-hidden="true">
                            &times;
                        </button>
                        <h4 class="modal-title" id="myModalLabel">
                            留言
                        </h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <div class="col-sm-12">
                                <textarea name="content" class="form-control" rows="5" placeholder="请输入留言内容"></textarea>
                                <span class="error text-danger ErrorText"></span>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary" id="addComments">
                            确定
                        </button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                        </button>
                    </div>
                </div>
                <!-- /.modal-content -->
            </div>
            <!-- /.modal -->
        </div>
    </form>
</div>
<script type="text/javascript">
    $("#addComments").click(function () {
        var serialize = $("#form").serialize();
        $.ajax({
            url: 'add_comments',
            data: serialize,
            type: 'post',
            cache: false,
            success: function (data) {
                if (data.state) {
                    window.location.reload();
                } else {
                    $(".ErrorText").html(data.msg);
                }
            },
            error: function () {
                alert("异常！");
            }
        });
    });
    $(".contentpanel").on("click", ".disableComments", function () {
        var button = $(this);
        var uuid = button.attr("uuid");
        $.ajax({
            url: 'disable',
            data: {uuid: uuid},
            type: 'post',
            cache: false,
            success: function (data) {
                var parents = button.parents("li");
                parents.html(data);
            },
            error: function () {
                alert("异常！");
            }
        });
    });
</script>
</body>
</html>
